<template>
<el-dialog  :title="runData.name"   width="900px" :close-on-click-modal="false" v-model="props.runDialog"  @open="initData"  @close="cancelForm" v-dialogDrag>
  <el-form :model="runData.form" label-width="120px">
    <div v-if="runData.form.status == 'wait'">
      <el-form-item label="实际开始时间">
        <el-date-picker
          v-model="runData.form.realBegan"
          type="date"
          placeholder="实际开始时间"
          style="width: 100%"
        />
      </el-form-item>
    </div>
    <div v-if="runData.form.status == 'doing'">
      <el-form-item label="实际结束时间">
        <el-date-picker
          v-model="runData.form.realEnd"
          type="date"
          placeholder="实际结束时间"
          style="width: 100%"
        />
      </el-form-item>
    </div>

    <el-form-item label="项目描述">
      <el-input v-model="runData.form.desc" type="textarea" />
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="onRunSubmit">保存</el-button>
      <el-button @click="cancelForm" >关闭</el-button>
    </el-form-item>
  </el-form>
</el-dialog>

</template>
<script setup >
  import { computed, ref,onMounted ,reactive,defineProps,defineEmits,nextTick } from 'vue'
  import {ProjectSaveOrUpdate } from '@/api/project'
  import { ElMessage } from 'element-plus';

  const runData=reactive({
    form:{},
    name:''
  });

  let props = defineProps({
    runDialogData:{                            // 父组件v-model绑定的值
      type:Object,
    },
    runDialog:{
      type: Boolean,
    },
    isUpdate:{
      type: Boolean,
    }
  });

  const initData=()=>{
    runData.form=props.runDialogData;
    runData.name=props.runDialogData.name;
  }

  //提交运行
  const onRunSubmit = () => {
    let param = {};
    param.id= runData.form.id
    param.status=runData.form.status=='wait'?'doing':'closed';

    ProjectSaveOrUpdate(param).then(res => {
      if(res.code==200) {
        runData.form = {};
        runData.name = '';
        emits('renovate');
        ElMessage.success("数据操作成功!");
        cancelForm();
      }else{
        ElMessage.error(res.message);
      }
    })
  }

  // 2、定义发射给父组件的方法
  const emits = defineEmits(['update:runDialog','renovate'])

  const cancelForm=()=>{
    emits('update:runDialog',false);
  }


</script>
